跳到主要内容

用数据绑定控制血条（Health Bar）

难度：入门（Beginner）

本教程演示如何把 Unity 里的数值（health）绑定到 Rive 血条，并监听 gameOver 触发器（Trigger）。

完成项目参考：

你将完成​

  • 在屏幕空间显示一个 Rive 血条
  • 编写 HealthBarController：
    • 设置 view model 的 health 数值
    • 监听 gameOver 触发器
  • （可选）添加键盘脚本测试受伤/回血

前置要求​

步骤 1：导入 .riv​

把 .riv 拖进 Unity Project 窗口，Unity 会创建 Rive Asset。

步骤 2：显示到 UI​

把 Rive Asset 拖到 Scene Hierarchy，创建 Panel/Widget（uGUI 路径）。

场景中需有 EventSystem，否则指针交互不可用。

步骤 3：配置 Rive Widget​

在 Inspector 确认：

  1. 选对 Artboard Name 和 State Machine Name
  2. Data Binding Mode 设为 Auto Bind Default
  3. 建议 Fit 设为 Layout（响应式）

布局细节：/docs/Game Runtimes/Unity/Layouts

步骤 4：创建 HealthBarController​

核心思路：

  • 在 OnWidgetStatusChanged 且 Loaded 后获取 ViewModelInstance
  • 拿到 health 的 NumberProperty 与 gameOver 的 TriggerProperty
  • 订阅变化回调，转发到 UnityEvent
  • 暴露 Damage() / Heal() 给游戏逻辑调用

关键代码（精简版）：

public void Damage(float amount) => WriteHealth(Health - amount);
public void Heal(float amount) => WriteHealth(Health + amount);
m_healthProperty = viewModelInstance.GetNumberProperty("health");
m_gameOverProperty = viewModelInstance.GetTriggerProperty("gameOver");

建议把 Rive 相关细节集中在这个 controller，避免业务代码直接依赖具体 property 名称。

步骤 5：Inspector 绑定​

  • 把 HealthBarController 挂到对象上
  • 绑定 Rive Widget
  • 设定 Starting Health
  • （可选）把 On Game Over 接到你的游戏逻辑

（可选）键盘测试​

可新增脚本：

  • ← 扣血（Damage）
  • → 加血（Heal）

若使用新输入系统（Input System），确认项目已启用对应设置。

步骤 6：从游戏逻辑驱动​

你的业务脚本只需调用：

  • Damage(amount)
  • Heal(amount)

也可监听：

  • OnHealthChanged
  • OnGameOver

这样可将“表现”与“逻辑”解耦：只要数据契约（health/gameOver）不变，替换 .riv 视觉稿无需改业务代码。